    <?php defined('BASEPATH') OR exit('No direct script access allowed'); ?><!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="Bookmark" href="/favicon.ico" >
    <link rel="Shortcut Icon" href="/favicon.ico" />
    <!--[if lt IE 9]>
    <script type="text/javascript" src="/public/js/html5shiv.js"></script>
    <script type="text/javascript" src="/public/js/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/Hui-iconfont/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/h-ui.admin/css/style.css" />
    <link rel="stylesheet" type="text/css" href="/public/plugins/laydate/skins/default/laydate.css"/>
    <!--[if IE 6]>
    <script type="text/javascript" src="/public/js/DD_belatedPNG_0.0.8a-min.js" ></script>
    <script>DD_belatedPNG.fix('*');</script>
    <![endif]-->
    <title>快方管理后台</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <style type="text/css">
        .date{
            width: 100px;
        }
    </style>
</head>
<body class="big-page">

<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 订单管理 <span
        class="c-gray en">&gt;</span> 小时汇总统计 <a class="btn btn-success radius r"  style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新">
        <i class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="Hui-article">
    <article class="cl pd-20">
        <div class="skin-minimal mt-5">
            <form class="form1" method="get">
            <input type="text" class="date input-text radius" name="start_date" value="<?=$_GET['start_date'] ? $_GET['start_date'] : date("Y-m-d") ?>" />

            <button class="btn btn-success radius" type="submit"><i class="Hui-iconfont"></i> 查询</button>
            <input type="button" id="export" class="btn btn-success radius" value="导出"/>
            </form>
        </div>
            
        <div class="mt-10">
            <div id="container" style="width:100%; height:400px;"></div>
            <div id="container_2" style="width:100%; height:400px;margin-top: 20px;"></div>
        </div>
    </article>
</div>

<script type="text/javascript" src="/public/js/jquery.min.js"></script>
<script type="text/javascript" src="/public/plugins/echart/echarts.common.min.js"></script>
<script type="text/javascript" src="/public/plugins/layer/layer.js"></script>
<script type="text/javascript" src="/public/plugins/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="/public/plugins/h-ui.admin/js/H-ui.admin.js"></script>
<script type="text/javascript" src="/public/plugins/laydate/laydate.js"></script>


<script type="text/javascript">
    $('.date').on('click', function () {
        laydate({format: 'YYYY-MM-DD', istime: false})
    });

    $.post("/ThirdStat/index?debug=1", {"start_date" : $("input[name='start_date']").val()}, function(res){
           
        var myChart = echarts.init(document.getElementById('container'));
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: res.title
            },
            color:"#7cb5ec #434348 #90ed7d #f7a35c #8085e9 #f15c80 #e4d354 #2b908f #f45b5b #91e8e1".split(" "),
            legend: {
                data:res.item
            },
            tooltip : {
                trigger: 'axis',
                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                    type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis : [
                {
                    type : 'category',
                    data : res.timeLine,
                    axisTick: {
                        alignWithLabel: true
                    }
                }
            ],
            yAxis : [
                {
                    type : 'value'
                }
            ],
            series: res.series
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);        
            
    }, "json")

    $.post("/ThirdStat/time", {"start_date" : $("input[name='start_date']").val()}, function(res){

        var myChart = echarts.init(document.getElementById('container_2'));
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: res.title
            },
            color:"#7cb5ec #434348 #90ed7d #f7a35c #8085e9 #f15c80 #e4d354 #2b908f #f45b5b #91e8e1".split(" "),
            legend: {
                data:res.item
            },
            tooltip : {
                trigger: 'axis',
                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                    type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis : [
                {
                    type : 'category',
                    data : res.timeLine,
                    axisTick: {
                        alignWithLabel: true
                    }
                }
            ],
            yAxis : [
                {
                    type : 'value'
                }
            ],
            series: res.series
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option); 
        
    }, "json")

    $('#export').on('click',function () {
        var start_date = $("input[name='start_date']").val();

        $.ajax({
            url:'/ThirdStat/exportTable',
            type:'POST',
            data:{start_date : start_date},
            dataType:"json",
            success:function(res){
                alert(res.msg);
            }
        });
    })    
</script>
</body>
</html>
